<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>查看报表</title>
    <style>
        #container {
            width: 80%;
            margin: 10px auto;
        }
        a {
            text-decoration: none;
            color: darkcyan;
        }
        #main {
            width: 600px;
            height: 400px;
        }
    </style>
</head>
<body>
    <div id="container">
        <a href="/export/">导出Excel报表</a>
        <div id="main"></div>
    </div>
    <script src="https://cdn.bootcdn.net/ajax/libs/echarts/4.8.0/echarts.min.js"></script>
    <script>
        let myChart = echarts.init(document.querySelector('#main'))
        fetch('/bar/')
            .then(resp => resp.json())
            .then(json => {
                let option = {
                    title: {
                        text: '老师得票统计图'
                    },
                    tooltip: {},
                    legend: {
                        data: ['好评', '差评']
                    },
                    xAxis: {
                        data: json.x
                    },
                    yAxis: {},
                    series: [
                        {
                            name: '好评',
                            type: 'bar',
                            data: json.y1
                        },
                        {
                            name: '差评',
                            type: 'bar',
                            data: json.y2
                        },
                    ]
                }
                myChart.setOption(option)
            })
    </script>
</body>
</html>